import React from 'react';
import './Operate.scss'
import { Menu, Layout } from 'antd';
import {
    HomeOutlined,
    ReadOutlined,
    CarOutlined,
    SettingOutlined,
} from '@ant-design/icons';
import { Link, Outlet } from 'react-router-dom'
import { useEffect, useState } from 'react';
// 定义布局
const { Sider, Content } = Layout;
// cebianlan
function getItem(label, key, icon, children, type) {
    return {
        key,
        icon,
        children,
        label,
        type,
    };
}

const items = [
    getItem(<Link to="/home/Operate/OperationOverview">运营总览</Link>, '1', <HomeOutlined />),
    getItem('内容管理', '2', <ReadOutlined />, [
        getItem(<Link to="/home/Operate/ArticlePublishingManagement">文章发布管理</Link>, '3',),
        getItem(<Link to="/home/Operate/ContentCommentManagement">内容评论管理</Link>, '4',),
    ]),
    getItem("招商管理", '5', <CarOutlined />, [
        getItem(<Link to="/home/Operate/ContractSigningManagement">合同签订管理</Link>, '6'),
        getItem(<Link to="/home/Operate/CustomerInformationManagement">客户信息管理</Link>, '7'),
    ]),
    getItem('租户管理', '8', <SettingOutlined />, [
        getItem(<Link to="/home/Operate/TenantInformationManagement">租户信息管理</Link>, '9'),
        getItem(<Link to="/home/Operate/TenantManagement">租户人员管理</Link>, '10'),
    ]),
    getItem('资产管理', '11', <SettingOutlined />, [
        getItem(<Link to="/home/Operate/BuildingInformationManagement">楼宇信息管理</Link>, '12'),
        getItem(<Link to="/home/Operate/CommonResourceManagement">公共资源管理</Link>, '13'),
    ]),
    getItem('账单管理', '14', <SettingOutlined />, [
        getItem(<Link to="/home/Operate/VehicleBill">车辆缴费账单</Link>, '15'),
        getItem(<Link to="/home/Operate/TenantBillingManagement">租户账单管理</Link>, '16'),
    ])
]
const Operate = () => {
    const [arr, setarr] = useState([])
    let arr2 = []
    useEffect(() => {
        const id = sessionStorage.getItem("id");
        items.forEach((v, i) => {
            console.log(v +":" + i);
            if (id == 1 || id == 3) {
                arr2.push(v);
            }else {
                if(i == 0){
                    arr2.push(v);
                }
            }
        })
        setarr(arr2)
        console.log("arr2" + arr2)
    }, [])
    return (
        <Layout>
            <Sider width={256}>
                <div
                    style={{
                        width: 256,
                    }}
                >
                    <Menu
                        defaultSelectedKeys={['1']}
                        defaultOpenKeys={['sub1']}
                        mode="inline"
                        theme="dark"
                        items={arr}
                    />
                </div>
            </Sider>
            <Layout>
                <Content>
                    <Outlet />
                </Content>
            </Layout>
        </Layout>

    );
};
export default Operate
